<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
    <title>个人中心</title>
    <link rel="stylesheet" type="text/css" href="../../css/api.css" />
    <link rel="stylesheet" type="text/css" href="../../css/common.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui.css" />
    <link rel="stylesheet" type="text/css" href="../../css/aui-pull-refresh.css" />
    <style>
        html,
        body {
            width: 100%;
            min-height: 100%;
            background: #F3EFEE;
        }

        .aui-active .aui-bar-tab-label {
            color: #f5a51c
        }

        .login {
            height: 240px;
            background-image: -webkit-linear-gradient(0deg, #f5c674, #ed824c);
            /*background-image: url(../../image/personal_bkg.jpg);background-repeat: no-repeat; background-size: cover;*/
            position: relative;
        }

        .login .personal_logo {
            width: 4rem;
            height: 4rem;
            border-radius: 50%;
            margin: 0 auto 9px;
            /*position: absolute; top: 60px; left: 20px;*/
        }

        .login .userinfo {
            position: absolute;
            top: 60px;
            text-align: center;
            left: 0;
            right: 0;
        }

        .login .userinfo .title {
            font-size: 0.8rem;
            color: #fff;
        }
        /* 设置条目 */

        .item {
            height: 3rem;
            line-height: 3rem;
            padding-left: 0.7rem;
            background-color: #fff;
        }

        .item_ico {
            float: left;
            width: 2.3rem;
            padding: 0.7rem 0.7rem 0.7rem 0;
        }

        .item_arrow {
            float: right;
            width: 1.5rem;
            padding: 1rem 0.7rem 1rem 0;
        }

        .item span {
            font-size: 0.7rem;
        }
    </style>
</head>

<body>
    <div id="app" v-cloak>

        <div class="user_nav_line"></div>
        <div class="aui-refresh-content">
            <div class="aui-content aui-margin-b-15">
                <ul class="aui-list aui-media-list">
                    <li class="aui-list-item aui-list-item-middle" onclick="openPhone('user_phone_list')">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner aui-list-item-arrow">
                                变更手机号
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item aui-list-item-middle" onclick="openPassword('./changePassword.html')">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner aui-list-item-arrow">
                                修改密码
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item aui-list-item-middle" onclick="openPassword('./personMsg.html')">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner aui-list-item-arrow">
                                个人资料
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="user_nav_line"></div>
                    </li>
                    <li class="aui-list-item aui-list-item-middle" onclick="openPassword('./payPassword.html')">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner aui-list-item-arrow">
                                支付密码
                            </div>
                        </div>
                    </li>
                    <li>
                        <div class="user_nav_line"></div>
                    </li>
                    <li class="aui-list-item aui-list-item-middle">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner aui-list-item-arrow" @click="toast()">
                                <div class="aui-list-item-text">
                                    <div class="aui-list-item-title aui-font-size-14">清除缓存</div>
                                    <div class="aui-list-item-right" style="color:#999">{{sizeBK}}</div>
                                </div>
                            </div>
                        </div>
                    </li>
                    <li class="aui-list-item aui-list-item-middle">
                        <div class="aui-media-list-item-inner">
                            <div class="aui-list-item-inner aui-list-item-arrow">
                                去评分
                            </div>
                        </div>
                    </li>
                </ul>
                <button v-if="token" type="button" name="button" class="user_set_btn" onclick="login()" style="border-radius:1rem;">退出登录</button>
            </div>
        </div>

    </div>
</body>
<script type="text/javascript" src="../../script/api.js"></script>
<script type="text/javascript" src="../../script/zepto.js"></script>
<script type="text/javascript" src="../../script/vue.min.js"></script>
<script type="text/javascript" src="../../script/utils.js"></script>
<script type="text/javascript" src="../../script/common.js"></script>
<script type="text/javascript" src="../../script/aui-tab.js"></script>
<script type="text/javascript" src="../../script/aui-scroll.js"></script>
<script type="text/javascript" src="../../script/aui-pull-refresh.js"></script>
<script type="text/javascript">
    function login() {
        // api.openWin({
        //     name: 'login',
        //     url: './headerone.html',
        //     pageParam: {
        //         msg:'',
        //         url:'./login.html'
        //     }
        // });
        $api.rmStorage('rong-token');
        $api.rmStorage('user_id');
        $api.rmStorage('token');
        $api.rmStorage('user_name');
        $api.rmStorage('user_phone');
        $api.rmStorage('user_data');
        $api.rmStorage('cartNum');
        api.sendEvent({
            name: 'cartNum',
            extra: {
                num: 0,
            }
        })
        var jsfun = 'window.location.reload();';
        api.execScript({
            name: 'root',
            frameName: 'five_frame/index.html',
            script: jsfun
        });
        api.execScript({
            name: 'root',
            frameName: 'carlist',
            script: jsfun
        });
        api.closeWin({
            name: 'person'
        });
    }



    function openPassword(url) {
      api.ajax({
          url: window.Url.Freeucenter_takepassword,
          method: 'post',
          data: {
              values: {
                  token: $api.getStorage('token'),
              }
          }
      }, function(ret, err) {
          if (ret) {
              if (ret.re == -1) {
                  alert(ret.info);
              }else if(ret.re == 3) {
                api.openWin({
                    name: 'type',
                    url: url,
                    pageParam: {
                        list:2
                    }
                });
              }else if(ret.re == 1) {
                api.openWin({
                    name: 'type',
                    url: url,
                    pageParam: {
                        list:1
                    }
                });
              }

          } else {
              console.log(JSON.stringify(err));
          }
      });

    }

    function openPhone(name) {
        api.openWin({
            name: name,
            url: './user_phone.html',
            pageParam: {
                name: name
            }
        });

    }

    function openWinInfo(type) {
        api.openWin({
            name: 'type',
            url: './userInfo.html',
            pageParam: {
                name: 'test'
            }
        });

    }


    apiready = function() {

        setRefresh()
        var app = new Vue({
          el:"#app",
          data:{
            token: '',
            sizeBK: ''
          },
          created:function() {
            var $_this = this;
            $_this.token = $api.getStorage('token') || '';
            $_this.hq_hc()
          },
          methods: {
            //清除缓存
    				close_hc:function() {
    					var $_this = this;
    					api.clearCache(function() {
    							api.getCacheSize(function(ret, err) {
    								if(parseInt(ret.size/1024) > 0 ) {
    									$_this.close_hc();
    								}else {
    									api.toast({
    											msg: '清除完成'
    									});
    								}
    							})
    					});
    					$_this.hq_hc()
    				},
            //读取缓存
            hq_hc:function() {
              var $_this = this;
              api.getCacheSize(function(ret, err) {
                if(parseInt(ret.size/1024) > 1024) {
                  $_this.sizeBK = Math.floor(((ret.size/1024)/1024) * 100) / 100 + 'MB'
                }else {
                  $_this.sizeBK = parseInt(ret.size/1024) + 'KB'
                }
              });
            },
            toast:function() {
              var $_this = this;
                api.confirm({
                    title: '确定要清除缓存吗？',
                    buttons: ['确定', '取消']
                }, function(ret, err) {
                    var index = ret.buttonIndex;
                    if (index == 1) {
                        $_this.close_hc()
                    }
                })
            }
          }
        })


    };


    //刷新
    function setRefresh() {
        var pullRefresh = new auiPullToRefresh({
            container: document.querySelector('.aui-refresh-content'),
            triggerDistance: 100
        }, function(ret) {

            if (ret.status == "success") {
                setTimeout(function() {
                    pullRefresh.cancelLoading(); //刷新成功后调用此方法隐藏
                }, 1500)
            }
        })
    }
</script>

</html>
